<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>五子棋游戏大厅</TITLE>
<META http-equiv=Content-Type content="text/html; charset=UTF-8">
<script>
var seat = ""; //save the seat the man has been sit down. a tabel host or guest
var table_num = 0;//save the seat the man has been sit down. The number of a table
//ready img for two users
var ready_img_src = "<img src=\"/public/images/fivechess/ready.gif\" width=\"18\" height=\"20\">";
var yourmethod = "get";
var user_status = 0;

var user_name = {};
var user_face = {};
user_name["0"] = "";
user_face["0"] = 0;
<? foreach($this->users as $userone)	{ ?>
	user_name["<? echo $userone['id'] ?>"] = "<? echo $userone['username'] ?>";
	user_face["<? echo $userone['id'] ?>"] = <? echo $userone['face'] ?>;
<? } ?>
function GetXmlHttpObject()
{
	var xmlHttp=null;
	try
	{
		// Firefox, Opera 8.0+, Safari
		xmlHttp=new XMLHttpRequest();
	}
	catch (e)
	{
		//Internet Explorer
		try
		{
			xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
		}
		catch (e)
		{
			xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
	return xmlHttp;
}
//refresh gameroom
function gameroom_init()
{
	time=window.setInterval("ajxSendGameRoom()",3000);	
}


var xmlHttp = GetXmlHttpObject();
function ajxSendGameRoom()
{ 
	if (xmlHttp==null)
	 {
		 alert ("Browser does not support HTTP Request");
		 return;
	 }
	if(table_num == 0 )	return;
	var url="<? echo $this->baseUrl ?>/index/gameroom/method/" + yourmethod + "/table/" + table_num + "/usertype/" + seat + "/your_id/<? echo $this->user['id']?>/status/"+user_status+"/";
	//url=url+"?q="+str
	//url=url+"&sid="+Math.random()
	if(yourmethod == "set")
		yourmethod = "get";
	xmlHttp.open("GET",url,true);
	xmlHttp.onreadystatechange=ajxReceiveGameRoom; 
	xmlHttp.setRequestHeader("If-Modified-Since","0");
	xmlHttp.send(null);
}

function ajxReceiveGameRoom()	
{
  if (xmlHttp.readyState == 4 && xmlHttp.status == 200){
		if (!xmlHttp.responseText || xmlHttp.responseText=="") return;
		var restxt = xmlHttp.responseText.split("!");
		for(var i = 0; i < restxt.length; i++)	{
			var table = 	restxt[i].split("|");
			var table_id = table[0];	//table id
			var host_user_str = String(table[1]);	//
			var guset_user_str = String(table[2]);
			var table_status = Number(table[3]);
			
			//change host status
			var host_img = document.getElementById("img" + table_id +"_host");
			var host_name = document.getElementById("host_name" + table_id);
			var host_user = eval("document.ftable" + table_id + ".host_user");
			var host_ready = document.getElementById("host_ready" + table_id);
			
			if(host_user.value != "<? echo $this->user['id'] ?>" && host_user_str != "<? echo $this->user['id'] ?>"  && host_img.src.substr(host_img.src.length - 11) != "nomanin.gif" )	{	
				host_img.src = "../../../../public/images/fivechess/face/" + user_face[host_user_str] + ".gif"; // 2 会变成用户的图像
				host_name.innerHTML = user_name[host_user_str];
				host_user.value = host_user_str;	
				if(table_status == 3 || table_status == 1)
					host_ready.innerHTML = ready_img_src;
			}
			
			//change guest status
			var guest_img = document.getElementById("img" + table_id +"_guest");
			var guest_name = document.getElementById("guest_name" + table_id);
			var guset_user = eval("document.ftable" + table_id + ".guset_user");
			var guest_ready = document.getElementById("guest_ready" + table_id);

			if(guset_user.value != "<? echo $this->user['id'] ?>" && guset_user_str != "<? echo $this->user['id'] ?>"  && guest_img.src.substr(guest_img.src.length - 11) != "nomanin.gif" )	{
				guest_img.src = "../../../../public/images/fivechess/face/" + user_face[guset_user_str] + ".gif"; // 2 会变成用户的图像
				guest_name.innerHTML = user_name[guset_user_str];
				guset_user.value = guset_user_str;	
				if(table_status == 4 || table_status == 1)
					guest_ready.innerHTML = ready_img_src;
			//if two user are ready ,then can start the game.
			}
			if(table_status == 1 && (host_user_str == "<? echo $this->user['id'] ?>" || guset_user_str == "<? echo $this->user['id'] ?>" ) )	{	
				var table_form = eval("document.ftable"+table_id);
				table_form.submit();
				return ;
			}
		}
  }
}

function MouseIn(sit)
{//if the img isn't the nomanin, modify it to it.
	if(sit.src.search("0.gif") != -1)
	sit.src = "../../../../public/images/fivechess/face/nomanin.gif";
}

function MouseOut(sit)
{//if the img isn't the nomanout, modify it to it.
	if(sit.src.search("nomanin.gif") != -1)
		sit.src = "../../../../public/images/fivechess/face/0.gif";
}

function sitdown(num, se)
{
	//alert(where.src);
	//var pic = "" + who;
	//leave recover the picture,name,and hostid or guestid to before.
	var myimg = document.getElementById("img" + num +"_"+ se);
	var myname = document.getElementById(se + "_name" + num);
	var myuser_id = eval("document.ftable" + num + "." + se + "_id");
	
	if(myimg.src.substr(myimg.src.length - 11) != "nomanin.gif") return ;
	
	//if(myimg.src.search("nomanout.gif") != -1)
	if(seat != "" && table_num != 0)	{//if I has sit down some time,clear the img and name;
		var img_be = document.getElementById("img" + table_num +"_"+ seat);
		var name_be = document.getElementById(seat + "_name" + table_num);
		var user_id_be = eval("document.ftable" + table_num + "." + seat + "_id");
		img_be.src = "../../../../public/images/fivechess/face/0.gif";
		name_be.innerHTML = "";
		user_id_be.value = 0;
	}
	myimg.src = "../../../../public/images/fivechess/face/" + <? echo $this->user['face'] ?> + ".gif"; // 2 会变成用户的图像
	myname.innerHTML = "<? echo $this->user['username'] ?>";
	myuser_id.value = <? echo $this->user['id'] ?>;
	table_num = num;
	seat = se;
	//will notice database I have sit down on a table,please notice others.
	yourmethod = "set";
	ajxSendGameRoom();
	//alert(username.innerHTML);
}

function Ready()	{
		var host_ready = document.getElementById("host_ready" + table_num); //eval("document.ftable" + table_num + "." + "host_ready");
		var guest_ready = document.getElementById("guest_ready" + table_num);  //eval("document.ftable" + table_num + "." + "guest_ready");
	if(seat == "host")	{
		host_ready.innerHTML = ready_img_src;
		if(guest_ready.innerHTML.search(ready_img_src) != -1)
			user_status = 1;
		else
			user_status = 3;
	}
	else if(seat == "guest")	{
		guest_ready.innerHTML = ready_img_src;
		if(host_ready.innerHTML.search(ready_img_src) != -1)
			user_status = 1;
		else
			user_status = 4;
	}
	yourmethod = "set";
	ajxSendGameRoom();
}
</script>
</HEAD>
<BODY onLoad="gameroom_init()";  bgcolor="#51719e" >
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="3" bgcolor="d7eefd" height="20">&nbsp;<SPAN><A 
            onclick=showFiveRoom() 
            href="#">游戏大厅</A></SPAN>&nbsp;&nbsp;&gt;&nbsp;五子棋</td>
  </tr>
  <? $i=1; foreach($this->gamingArray as $gameroom): ?>
  
  <? if( ($i - 1) % 3 == 0 )	{ ?>
  <tr>
  <? } ?>
    <td  width="33%">
<form  name="ftable<? echo $gameroom['id'] ?>" method="post" action="<? echo $this->baseUrl ?>/fivechess/chessboard/table/<?= $gameroom['id'] ?>/your_id/<? echo $this->user['id']?>/" >
	<table width="119" height="130" align="center" border="0" cellspacing="0" cellpadding="0" background="/public/images/fivechess/table<? if($gameroom['status'] == 1) echo "_gaming"; ?>.gif">
      <tr>
        <td width="32">&nbsp;</td>
        <td width="18">&nbsp;</td>
        <td width="4">&nbsp;</td>
        <td width="13">&nbsp;</td>
        <td width="18">&nbsp;</td>
        <td width="34">&nbsp;</td>
      </tr>
      <tr>
        <td colspan="5" align="left" id="host_name<? echo $gameroom['id'] ?>" ><? echo $gameroom['host_name']  ?></td>
        <td>&nbsp;</td>
      </tr>
      
      <tr>
        <td height="28" ><IMG id=img<? echo $gameroom['id'] ?>_host onmouseover=MouseIn(img<? echo $gameroom['id'] ?>_host); 
           onclick=sitdown(<? echo $gameroom['id'] ?>,"host");   onmouseout=MouseOut(img<? echo $gameroom['id'] ?>_host); height=32 
            src="../../../../public/images/fivechess/face/<? echo $gameroom['host_face'] ?>.gif" width=32></td>
        <td  align="left" width="15" id="host_ready<? echo $gameroom['id'] ?>">
        	<? if($gameroom['status'] == 3 || $gameroom['status'] == 1) 
        			echo  "<img src=\"/public/images/fivechess/ready.gif\" width=\"18\" height=\"20\">"
        	?>
        </td>
        <td colspan="2"></td>
        <td  align="right" width="15" id="guest_ready<? echo $gameroom['id'] ?>">
        	<? if($gameroom['status'] == 4 || $gameroom['status'] == 1) 
        			echo  "<img src=\"/public/images/fivechess/ready.gif\" width=\"18\" height=\"20\">"
        	?>
        </td>
        <td><IMG id=img<? echo $gameroom['id'] ?>_guest onmouseover=MouseIn(img<? echo $gameroom['id'] ?>_guest); 
           onclick=sitdown(<? echo $gameroom['id'] ?>,"guest");  onmouseout=MouseOut(img<? echo $gameroom['id'] ?>_guest); height=32 
            src="../../../../public/images/fivechess/face/<? echo $gameroom['guest_face'] ?>.gif" width=32></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td colspan="5" align="right" id="guest_name<? echo $gameroom['id'] ?>" ><? echo $gameroom['guest_name'] ?> </td>
        </tr>
      <tr>
        <td>&nbsp;</td>
        <td colspan="4" align="center"><input type="button" name="ready" value="开始" onClick="Ready();"></td>
        <td>&nbsp;</td>
      </tr>
    </table>
    <input name="host_user" type="hidden" value="<?=$gameroom['host_user'] ?>">
    <input name="guset_user" type="hidden" value="<?=$gameroom['guset_user'] ?>">
	</form>
	</td>
	<? if($i == $this->count)	{ ?>
  	<? for($col = 0; $col < 3 - ($i % 3); $col++)	{ ?>
    <td  width="33%">
		</td>
  	<? } ?>
	<? } ?>
  <? if( $i % 3 == 0 && $i != 1)	{ ?>
	</tr>
  <? } ?>
  <? $i++; endforeach; ?>
</table>
</BODY>
</HTML>
